<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>人员管理</title>
<%@ include file="common.jsp"%>
<script type="text/javascript">
	$(function() {
		$("#btn_query").click(function(){
			$("#tb_departments").bootstrapTable('refresh');
		});
		//1.初始化Table
		var oTable = new TableInit();
		oTable.Init();

		//2.初始化Button的点击事件
		var oButtonInit = new ButtonInit();
		oButtonInit.Init();
		
		//定时刷新页面
		setInterval("setTime()",3000);
	});

	var TableInit = function() {
		var oTableInit = new Object();
		//初始化Table
		oTableInit.Init = function() {
			$('#tb_departments').bootstrapTable({
				url : '${pageContext.request.contextPath }/peopleManage/select.do', //请求后台的URL（*）
				method : 'get', //请求方式（*）
				toolbar : '#toolbar', //工具按钮用哪个容器
				striped : true, //是否显示行间隔色
				cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
				pagination : true, //是否显示分页（*）
				sortable : false, //是否启用排序
				sortOrder : "asc", //排序方式
				queryParams : oTableInit.queryParams,//传递参数（*）
				sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
				pageNumber : 1, //初始化加载第一页，默认第一页
				pageSize : 10, //每页的记录行数（*）
				pageList : [ 10, 20, 30 ], //可供选择的每页的行数（*）
				clickToSelect : true, //是否启用点击选中行
				height : 488, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
				uniqueId : "ID", //每一行的唯一标识，一般为主键列
				detailView : false, //是否显示父子表
				columns : [ {
					checkbox : true
				}, {
					field : 'machin',
					align : 'center',
					title : '设备'
				}, {
					field : 'peoplenum',
					align : 'center',
					title : '作业人员'
				}, {
					field : 'ndate',
					align : 'center',
					title : '日期'
				}, {
					field : 'workstate',
					align : 'center',
					title : '状态'
				}, {
					field : 'worknum',
					align : 'center',
					title : '生产数量'
				}, {
					field : 'endgood',
					align : 'center',
					title : '良品'
				}, {
					field : 'endngood',
					align : 'center',
					title : '不良品'
				}, {
					field : 'worktimelong',
					align : 'center',
					title : '工作小时'
				} ]
			});
		};

		//得到查询的参数
		oTableInit.queryParams = function(params) {
			var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
				limit : params.limit, //页面大小
				offset : params.offset, //页码
				peoplenum : $("#peoplenum").val(),
				workstate : $("#workstate").val()
			};
			return temp;
		};
		return oTableInit;
	};

	var ButtonInit = function() {
		var oInit = new Object();
		var postdata = {};

		oInit.Init = function() {
			//初始化页面上面的按钮事件
		};
		return oInit;
	};
	function setTime() {
		$('#tb_departments').bootstrapTable("refresh",  { 
			url: '${pageContext.request.contextPath }/peopleManage/select.do'
			});
	}
</script>
</head>
<body>
	<div class="panel-body" style="padding-bottom: 0px;">
		<div class="panel panel-default">
			<div class="panel-heading">查询条件</div>
			<div class="panel-body">
				<form id="formSearch" class="form-horizontal">
					<div class="form-group" style="margin-top: 15px">
						<label class="control-label col-sm-1" for="peoplenum">作业人员</label>
						<div class="col-sm-3">
							<input type="text" class="form-control" id="peoplenum">
						</div>
						<label class="control-label col-sm-1" for="workstate">状态</label>
						<div class="col-sm-3">
							<input type="text" class="form-control" id="workstate">
						</div>
						<div class="col-sm-4" style="text-align: left;">
							<button type="button" style="margin-left: 80px;"
								id="btn_query" class="btn btn-primary">查询</button>
						</div>
					</div>
				</form>
			</div>
		</div>
		<table id="tb_departments">
		</table>
	</div>
</body>
</html>